<template>
  <div class="navMenu">
    <template v-for="navMenu in navMenus">
      <!-- 最后一级菜单 -->
      <el-menu-item
        v-if="navMenu.type.trim()=='LINK'"
        :key="navMenu.id"
        :data="navMenu"
        :index="navMenu.name"
      >
        <i :class="navMenu.icon"></i>
        <span slot="title">{{navMenu.alias}}</span>
      </el-menu-item>

      <!-- 此菜单下还有子菜单 -->
      <el-submenu v-if="navMenu.type.trim()=='NONE'" :key="navMenu.id" :data="navMenu" :index="navMenu.id+''">
        <template slot="title">
          <i :class="navMenu.icon"></i>
          <span>{{navMenu.alias}}</span>
        </template>
        <NavMenu :navMenus="navMenu.children"></NavMenu>
      </el-submenu>
    </template>
  </div>
</template>
  
<script>
export default {
  name: "NavMenu",
  props: ["navMenus"],
  data() {
    return {};
  },
  methods: {
    goto(path) {
      if(path) {
        this.$router.push(path);
      }
    }
  }
};
</script>
  
<style scoped>
</style>